<template>
<vue-progress :percent.sync="progress.percent" :options="progress.options"></vue-progress>
<vs-modal :show.sync='showDetail' effect='fade' width='800px'>
  <div class="modal-header" slot="modal-header">
    <h4 class="modal-title">{{$t("log.logInfo")}}</h4>
  </div>
  <div class="modal-body" slot="modal-body">
    <pre id="my-log-show">{{resultTxt}}</pre>
  </div>
  <div class="modal-footer" slot="modal-footer">
    <button type="button" class="btn btn-default" @click.prevent="doExitResult">{{$t("common.quit")}}</button>
  </div>
</vs-modal>
<validator name="form">
<form class="form-horizontal">
  <validator name="form">
    <div class="form-group">
      <label class="col-sm-1 control-label">{{$t("log.serverAddr")}}</label>
      <div class="col-sm-2">
        <select class="form-control" type="text" v-model="moduleIndex">
          <option v-for="option in moduleOptions" :value="$index">{{option.text}}</option>
        </select>
      </div>
      <label class="col-sm-1 control-label">{{$t("log.sheBei")}}</label>
      <div class="col-sm-2">
        <input type="text" class="form-control" :placeholder="$t('log.serverIp')" v-model="serverIp" v-validate:server-ip="{ip: true}">
      </div>
      <div class="col-sm-1">
        <button class="btn btn-default" @click.prevent="onScan">
          <span class="glyphicon glyphicon-user"></span>{{$t("common.connect")}}
        </button>
      </div>
    </div>
  </validator>
  <div v-if="connect" class="form-group">
    <div class="form-group">
      <div>
        <p class="form-control-static text-center lead" v-if="titleLog"><strong>{{titleLog}}</strong></p>
      </div>
    </div>
    <div class="form-group" >
      <div class="col-md-8 col-md-offset-2">
        <label class="col-md-3 control-label">{{$t("log.logType")}}</label>
        <div class="col-md-7">
          <select class="form-control" v-model="logTypes" @change.prevent="onLogTypeChange">
            <option v-for="option in typeOptions" :value="option.value">{{option.text}}</option>
          </select>
        </div>
      </div>
    </div>
    <div class="form-group">
      <div class="col-md-8 col-md-offset-2">
        <div class="col-md-1 col-md-offset-3">
          <button type="button" class="btn btn-default" :disabled="disabled === 1" @click.prevent="doShowCodecLog">{{$t("log.logCheck")}}</button>
        </div>
      </div>
    </div>
    <div class="form-group">
      <div class="col-md-8 col-md-offset-2">
        <label class="col-md-3 control-label">{{$t("log.logExport")}}</label>
        <div class="col-md-2">
          <button type="button" class="btn btn-primary " @click.prevent="doGetLogFile">{{$t("log.startPackage")}}
            </button>
        </div>
        <div v-if="download">
          <a class="btn btn-default" href="{{logFileLink}}" target="_blank"><span class="glyphicon glyphicon-download"></span>{{$t("log.logDowload")}}</a>
        </div>
      </div>
    </div>
  </div>
</form> 
</template>

<script>
import _ from 'lodash'
import {http} from 'share/common/api.js'
import msgbox from 'libs/msgbox.js'
import async from 'async'
import ebus from 'libs/ebus.js'
import toast from 'libs/toast.js'
import locales from './locales.js'
import debugCfg from 'share/debugCfg.js'

export default{
  locales,
  replace: true,
  data: function () {
    return {
      progress: {
        percent: 0,
        options: {
          show: true,
          canSuccess: true,
          color: 'rgb(143, 255, 199)',
          failedColor: 'red',
          height: '2px'
        }        
      },
      download: false,
      showDetail: false,
      disabled: 0,
      resultTxt: '',
      serverIp: '',
      resultTxt: '',
      connect:　false,
      titleLog: this.$t("log.logInfo"),
      logTypes: '',
      moduleIndex: 0,
      moduleOptions: [{
        port: 7080,
        text: 'FOUNDER-100E/D/ES/DS',
        test: /^codec\.founder100/,
        logType: '/tmp/trace.txt',
        path: '',
        logTypeOptions:[{
          text: this.$t("log.logType1"),
          value: '/tmp/trace.txt'
        }, {
          text: this.$t("log.logType2"),
          value: '/tmp/trace1.txt'
        }, {
          text: this.$t("log.logType3"),
          value: '/tmp/trace2.txt'
        }, {
          text: this.$t("log.logType4"),
          value: '/tmp/trace3.txt'
        }]
      }, {
        port: 9080,
        text: 'M-CT-SERVER',
        test: /^server\.main\.pc/,
        logType: '/data/log/MainServer/trace.txt',
        path: '',
        logTypeOptions:[{
          text: this.$t("log.logType1"),
          value: '/data/log/MainServer/trace.txt'
        }]
      }, {
        port: 6080,
        text: 'M-MD-SERVER',
        test: /^server\.media\.pc/,
        logType: '/data/log/StreamServer/trace.txt',
        path: '',
        logTypeOptions:[{
          text: this.$t("log.logType1"),
          value: '/data/log/StreamServer/trace.txt'
        }]
      }]
    }
  },
  computed: {
    logFileLink() {
      return this.host + '/api/storage/file?type=AP&path=' + this.moduleOptions[this.moduleIndex].path
    },
    typeOptions() {
      return this.moduleOptions[this.moduleIndex].logTypeOptions
    },
    onLogTypeChange() {
      this.logTypes = this.moduleOptions[this.moduleIndex].logType
    },
    host() {
      return `http://${this.serverIp}:${this.moduleOptions[this.moduleIndex].port}`
    }
  },
  methods: {
    doExitResult() {
      this.showDetail = false
      this.disabled = false
    },
    onScan() {
      if (this.$form.invalid) {
        toast.e(this, this.$t('common.fail'), this.$t('error.invalidAddr'))
        this.connect = false
        return
      }
      http(this.host, '/api/platform/cfg', 'GET', null, {timeout: 1000}).then(function(res) {
        if(res && res.data && res.data.code === 0) {
          let devmodel = res.data.data.devModel
          if(devmodel === 'server.main.embv1') {
            this.connect = false
            toast.w(this, this.$t('common.finish'), this.$t('error.notFound'))
          } else {
            setTimeout(function() {
              return this.connect = true
            }.bind(this), 1000)
            this.download = false
          } 
        }
      }.bind(this), function(err) {
        this.connect = false
        toast.w(this, this.$t('common.finish'), this.$t('error.notFound'))
      }.bind(this))
    },
    doShowCodecLog() {
      this.$progress.start(3000)
      this.disabled = true
      async.waterfall([
        this.doLogin,
        this.doShowLog,
        ], function(err, result) {
          toast.w(this, this.$t('common.fail'), this.$t('error.noResponse'))
        }.bind(this))
      this.$progress.set(95 * 1 / 3)
    },
    doLogin(cb) {
      http(this.host, "/api/auth/login", "POST",{
        username: 'api',
        password: 'api'
      }).then(function(res){
        if(res && res.data && res.data.code === 0) {
          cb(null)
        } else{
          toast.w(this, this.$t('common.fail'), this.$t('error.noResponse'))
        }
      }.bind(this), function(err) {
        cb()
      })
    },
    doShowLog(cb) {
      this.$progress.set(95 * 2 / 3)
      let logType = this.moduleOptions[this.moduleIndex].logType
      http(this.host, '/api/storage/file?type=AP&path=' + this.logTypes, 'GET').then(function(res){
          this.$progress.set(95 * 1)
          this.resultTxt = res.data
          this.showDetail = true
          this.$progress.finish()
      }.bind(this), function(err) {
        cb()
      })
    },
    doGetLogFile() {
      this.download = false
      async.waterfall([
        this.doLogin,
        this.doClearTar,
        this.doGetFile,
        ], function(err, result) {
          toast.w(this, this.$t('common.fail'), this.$t('error.noResponse'))
        }.bind(this))
    },
    doGetFile(cb) {
      var req = {
        action: 'runShell',
        paramlist: {
          shName: 'logPackage.sh',
          isBg: 0
        }
      }
      http(this.host, '/api/common/cmd', 'POST', req).then(function(res){
        if(res && res.data && res.data.code === 0) {
          this.moduleOptions[this.moduleIndex].path = JSON.parse(res.data.data.result).path 
          this.download = true
        } else {
          toast.w(this, this.$t('common.fail'), this.$t('error.noResponse'))
        }
      }.bind(this), function(err){
        cb()
      })
    },
    doClearTar(cb) {
      var req = {
        action: 'runShell',
        paramlist: {
          shName: 'clearLogPackage.sh',
          isBg: 1
        }
      }
      http(this.host, '/api/common/cmd', 'POST', req).then(function(res){
        if(res && res.data && res.data.code === 0){
          cb()
        } else{
          toast.w(this, this.$t('common.fail'), this.$t('error.noResponse'))
        }
      }.bind(this), function(err){
        cb()
      })
    }
  },
  ready(){
    this.$progress.setHolder(this.progress)
    if(debugCfg.debugOn) {
      this.serverIp = debugCfg.ctServerIp
    }
  }
}
</script>

<style>
body {    
  padding: 50px;
  padding-top: 20px;
}
#my-log-show {
  max-height: 600px;
}
</style>